import { recordInitMediaOption, saveRegistration } from '@/services/api/api-interview-record';
import { AudioOutlined, PlusOutlined, SendOutlined } from '@ant-design/icons';
import {
  DrawerForm,
  FormListActionType,
  ModalForm,
  ProCard,
  ProForm,
  ProFormCascader,
  ProFormDateRangePicker,
  ProFormGroup,
  ProFormList,
  ProFormSelect,
  ProFormText,
} from '@ant-design/pro-components';
import { Button, Cascader, Form, message } from 'antd';
import React from 'react';
import { useRef, useState } from 'react';

interface EnrollMediaProps {
  onRefurbish: () => void;
  detailRegistData: InterviewRecordData.assignOrganizationList
  id: string;
}
const EnrollMedia: React.FC<EnrollMediaProps> = ({ onRefurbish, id, detailRegistData }) => {
  const repoterActionRef = useRef<FormListActionType<{ name: string; }>>();

  return (
    <DrawerForm
      title="报名"
      trigger={
        <Button type="primary" style={{
          background: '#87d068',
        }}>
          <SendOutlined />
          报名
        </Button>
      }
      autoFocusFirstInput
      drawerProps={{
        destroyOnClose: true,
        width: '30%'
      }}
      onOpenChange={(visible) => {
        if (visible) {
          console.log(detailRegistData);
        } else {
        }
        onRefurbish()
      }}
      submitTimeout={2000}
      onFinish={async (values) => {

        const res = await saveRegistration({
          recordId: id,
          personnelInformation: values.reporterList,
          attribute: 1
        })
        if (res.code === 0) {
          message.success('提交成功');
          onRefurbish()
          return true;
        } else {
          message.error("提交失败")
          onRefurbish()
          return false;
        }

      }}
    >
      <ProFormList
        name="reporterList"
        actionRef={repoterActionRef}
        creatorButtonProps={false}
        label={<div style={{ display: 'flex', justifyContent: 'space-between', width: '100vw' }}>
          <span style={{ fontSize: 16 }}>记者信息</span>
          <Button
            type="primary"
            style={{ display: 'flex', justifyContent: 'flex-end' }}
            onClick={() => {
              repoterActionRef.current?.add({
                name: '',
              });
            }}
          >
            添加记者信息
          </Button>
        </div>}
        initialValue={Array.isArray(detailRegistData?.personnelInformations) && detailRegistData?.personnelInformations.length > 0 ? detailRegistData?.personnelInformations : [
          {
            name: '',
          },
        ]}
      >
        <ProFormGroup key="group">
          <ProFormText name="name" label="姓名" />
          <ProFormText
            name="phone"
            label="电话"
            rules={[
              {
                pattern: /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/,
                message: '请输入正确的手机号'
              }
            ]}
          />
        </ProFormGroup>
      </ProFormList>
    </DrawerForm>
  );
};

export default EnrollMedia;